<template>
	<view>
		<uni-section title="选择时间" type="line" padding>
			<uni-datetime-picker placeholder="选择时间" @change="selectTime" v-model="select"></uni-datetime-picker>
		</uni-section>
		<uni-section title="时间区间" type="line" padding>
			<uni-datetime-picker type="daterange" @change="selectTime1" v-model="dateRange"></uni-datetime-picker>
		</uni-section>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				select: '',
				dateRange: [this.getDate(Date.now() - 5 * 24 * 3600000), this.getDate(Date.now() + 5 * 24 * 3600000)],
			}
		},
		methods: {
			selectTime(e) {
				console.log(e)
				this.select = e.detail
			},
			selectTime1(e) {
				console.log(e)
			},
			getDateTime(date) {
				return `${this.getDate(date)} ${this.getTime(date)}`
			},
			getDate(date) {
				date = new Date(date)
				const year = date.getFullYear()
				const month = date.getMonth() + 1
				const day = date.getDate()
				return `${year}-${this.addZero(month)}-${this.addZero(day)}`
			},
			getTime(date) {
				date = new Date(date)
				const hour = date.getHours()
				const minute = date.getMinutes()
				const second = date.getSeconds()
				return this.hideSecond ? `${this.addZero(hour)}:${this.addZero(minute)}` :
					`${this.addZero(hour)}:${this.addZero(minute)}:${this.addZero(second)}`
			},
			addZero(num) {
				if (num < 10) {
					num = `0${num}`
				}
				return num
			}
		}
		
	}
</script>

<style>

</style>